@media (max-width:413px) {
.ball-beat > div {
    width: 3px;
    height: 3px;
}
}
@media (min-width:414px) {
.ball-beat > div {
    width: 5px;
    height: 5px;
}
}
@-webkit-keyframes ball-beat {
 50% {
 opacity: 0.2;
 -webkit-transform: scale(0.75);
 transform: scale(0.75);
}
 100% {
 opacity: 1;
 -webkit-transform: scale(1);
 transform: scale(1);
}
}
 @keyframes ball-beat {
 50% {
 opacity: 0.2;
 -webkit-transform: scale(0.75);
 transform: scale(0.75);
}
 100% {
 opacity: 1;
 -webkit-transform: scale(1);
 transform: scale(1);
}
}
.ball-beat > div {
    background-color: #aaa;
    border-radius: 100%;
    margin: 2px;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: inline-block;
    -webkit-animation: ball-beat 0.7s 0s infinite linear;
    animation: ball-beat 0.7s 0s infinite linear;
}
.ball-beat > div:nth-child(2n-1) {
    -webkit-animation-delay: 0.35s !important;
    animation-delay: 0.35s !important;
}
.wrap {
    border-top:#ccc 1px solid;
}
.loaded {
    transition: opacity .25s linear;
    opacity: 1;
}
.loader {
    box-sizing: border-box;
    margin: auto;
    width:100px;
    padding:10px 0px;
}
.ball-beat{
    float:left;
    margin-right:10px
}



@media (min-width:414px) {
.hold-on > img{
    width:178px;
    margin-bottom:15px
}
.hold-on > p{
    font-size:22px;
}
}
@media (max-width:413px) {
.hold-on > img{
    width:128px;
    margin-bottom:10px
}
.hold-on > p{
    font-size:18px;
}
} 
.wrap{
    width:100%;
    height:100%;
    background-color:#f8f8f8;
}
.hold-on{
    width:80%;
    padding-top:100px;  
    margin:auto;
    height:auto;
    text-align:center;
    color:#666
}